<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>hello bootstrap</title>
    <!--导入bootstrap的主样式-->
    <link rel="stylesheet" href="css/bootstrap.min.css" type="text/css">

</head>
<body>
<div class="container">
    <h2>静态控件</h2>
    <form action="#" name="myform" class="form-horizontal">
        <div class="form-group">
            <lable class="col-md-1 control-label">Email</lable>
            <div class="col-md-4">
                <p class="form-control-static">yejf@163.com</p>
            </div>
        </div>

        <div class="form-group">
            <lable class="col-md-1 control-label">用户</lable>
            <div class="col-md-4">
                <input type="text" name="user" class="form-control" disabled>
            </div>
        </div>
    </form>

    <h2>水平表单</h2>
    <form action="#" name="myform" method="post" class="form-horizontal">
        <div class="form-group has-success has-feedback form-group-lg">
            <label class="col-md-1 control-label">用户名:</label>
            <div class="col-md-4">
                <input type="text" name="username" class="form-control" placeholder="UserName">
                <span class="glyphicon glyphicon-ok form-control-feedback"></span>
            </div>
        </div>
        <div class="form-group has-error has-feedback form-group-sm">
            <label class="col-md-1 control-label">密码:</label>
            <div class="col-md-4">
                <input type="password" name="password" class="form-control" placeholder="Password">
                <span class="glyphicon glyphicon-remove form-control-feedback"></span>
                <span class="help-block">
                    A block of help text that breaks onto a new line and may extend beyond one line.</span>
            </div>
        </div>

        <div class="form-group">
            <div class="col-md-offset-1 col-md-4">
                <div class="checkbox">
                    <label>
                        <input type="checkbox" name="remember">记住我
                    </label>
                </div>
            </div>
        </div>
        <div class="form-group">
            <div class="col-md-offset-1 col-md-4">
                <button type="submit" class="btn btn-success">提交</button>
            </div>
        </div>
    </form>

</div>
</body>
</html>